<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>小程序用户管理</title>
        <link rel="stylesheet" href="css/layui.css" media="all">
        <link rel="stylesheet" href="css/doc.css" media="all">
        <link href="css/bootstrap.min.css" rel="stylesheet">
    </head>

    <body>
        <div class="kit-doc">
            <blockquote class="layui-elem-quote">小程序用户管理
            </blockquote>
            <table class="layui-table">
                <colgroup>
                    <col width="5">
                    <col width="5">
                    <col width="5">
                    <col width="5">
                </colgroup>
                <thead>
                <tr>
                    <th style="width: 35px">
                        <div class="layui-input-inline">
                            <input type="text" lay-verify="required" placeholder="请输入用户名称"
                                   autocomplete="off"
                                   class="layui-input queryName" value="${queryName}">
                        </div>
                    </th>
                    <th style="width: 35px">
                        <div class="layui-input-inline">
                            <input type="text" lay-verify="required" placeholder="请输入手机号"
                                   autocomplete="off"
                                   class="layui-input queryPhone" value="${queryPhone}">
                        </div>
                    </th>
                    <th style="width: 35px">
                        <form class="layui-form">
                            <div class="layui-input-inline">
                                <select name="modules" lay-verify="required" class="departmentName">
                                    <option value="" style="height: 30px">请选择职位</option>
                                    <#list postList as post>
                                        <#if departmentName == post.postName>
                                            <option value="${post.postName}" selected>${post.postName}</option>
                                        <#else>
                                            <option value="${post.postName}">${post.postName}</option>
                                        </#if>
                                    </#list>
                                </select>
                            </div>
                        </form>
                    </th>
                    <th>
                        <div class="layui-btn-container">
                            <button type="button" class="layui-btn layui-btn-normal query">查询</button>
                        </div>
                    </th>
                </tr>
                </thead>
            </table>


            <table class="layui-table">
                <colgroup>
                    <col width="5">
                    <col width="70">
                    <col width="70">
                    <col width="50">
                    <col width="50">
                    <col width="100">
                    <col width="120">
                    <col width="150">
                </colgroup>
                <thead>
                <tr>
                    <th>id</th>
                    <th>用户名称</th>
                    <th>用户昵称</th>
                    <th>手机号码</th>
                    <th>邮箱</th>
                    <th>职位</th>
                    <th>生日</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>
                <#list users.records as user>
                    <tr>
                        <td>${user.id}</td>
                        <td>${user.name}</td>
                        <td>${user.nickName}</td>
                        <td>${user.phone}</td>
                        <td>${user.email}</td>
                        <td>${user.post}</td>
                        <td>${user.birthday}</td>
                        <td>
                            <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#add"
                                    onclick="add(${user.id})">发送邮件
                            </button>
                        </td>
                    </tr>
                </#list>
                </tbody>
            </table>
        </div>
        <!-- 发送邮件  -->
        <div class="modal fade" id="add" tabindex="-1" role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <form method="post" action="/addEmail">
                        <input type="hidden" name="pageNum" value="${users.current}"><#--当前第几页-->
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal"><span
                                        aria-hidden="true">&times;</span></button>
                            <h4 class="modal-title" id="exampleModalLabel">发送邮件</h4>
                        </div>
                        <div class="modal-body">
                            <div class="form-group">
                                <label for="recipient-name" class="control-label">用户Id:</label>
                                <input type="text" name="userId" id="id" class="form-control" required>
                            </div>
                            <div class="form-group">
                                <label for="recipient-name" class="control-label">邮件内容:</label>
                                <input type="text" name="content" class="form-control" required>
                            </div>
                            <div class="form-group">
                                <label for="recipient-name" class="control-label">发送时间:</label>
                                <input type="date" name="date" class="form-control" required>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                            <input type="submit" class="btn btn-primary" value="添加"/>

                        </div>
                    </form>
                </div>
            </div>
        </div>
        <div id="demo" style="margin-left: 470px;"></div>
        <script src="js/jquery-3.5.1.js"></script>
        <script src="js/bootstrap.min.js"></script>
        <script src="js/layui.all.js"></script>
        <script>
            //获取项目路径
            function URL() {
                return window.location.protocol + "//" + window.location.host + "/";
            }

            layui.use(['laypage'], function () {
                var laypage = layui.laypage
                laypage.render({
                    elem: 'demo'
                    , curr: '${users.current}'  //当前页数
                    , count: '${users.total}'   //总记录数
                    , limit: '${users.size}'    //每页记录数
                    , theme: '#009688'
                    , jump: function (obj, first) {
                        if (!first) {
                            var departmentName = $(".departmentName").val();
                            var queryPhone = $(".queryPhone").val();
                            var queryName = $(".queryName").val();
                            window.location.href = URL() + "appUserManage?pageNum=" + obj.curr + "&departmentName=" + departmentName + "&queryPhone=" + queryPhone + "&queryName=" + queryName;
                        }
                    }
                });
            });

            /**
             * 获取用户id
             */
            function add(e) {
                $.get(
                    "getZyAppUser?id=" + e,
                    function (data) {
                        $("#id").val(data.id);
                    }
                )
            }

            $(".query").click(function () {

                var departmentName = $(".departmentName").val();
                var queryPhone = $(".queryPhone").val();
                var queryName = $(".queryName").val();


                window.location.href = URL() + "appUserManage?pageNum=1&departmentName=" + departmentName + "&queryPhone=" + queryPhone + "&queryName=" + queryName;
            })

        </script>
    </body>
</html>